<template>
  <view>
    <view class="cu-list menu-avatar">
      <view class="cu-item" v-for="(item,index) in list" :key="index">
        <view class="cu-avatar round lg" :style="{'background-image':'url('+item.avatarUrl+')'}"></view>
        <view class="content">
          <view class="text-grey">{{item.nickName}}</view>
        </view>
        <view class="action">
          <view class="cu-tag round sm" :class="'bg-'+orange">{{index+1}}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
		id:0,
      list: [
        {
          //1
          userName: "哈士奇",
          u_id: "001",
          userPic: "../../../static/cover/cover-01.jpg",
          ranking: "1",
          color: "red"
        },
        {
          //2
          userName: "欧阳JJ",
          u_id: "002",
          userPic: "../../../static/cover/cover-02.jpg",
          ranking: "2",
          color: "orange"
        },
        {
          //3
          userName: "阿拉斯加",
          u_id: "003",
          userPic: "../../../static/cover/cover-01.jpg",
          ranking: "3",
          color: "yellow"
        },
        {
          //4
          userName: "萨摩耶",
          u_id: "004",
          userPic: "../../../static/cover/cover-01.jpg",
          ranking: "4",
          color: "grey"
        },
        {
          //5
          userName: "土狗",
          u_id: "005",
          userPic: "../../../static/cover/cover-01.jpg",
          ranking: "5",
          color: "grey"
        }
      ]
    };
  },
  onLoad(option) {
	console.log("onload");
	console.log(option);
	
	this.id = option.id;
	this.request({
		url: this.apiServer + "/class/findClassUserById?id="+this.id
	}).then(res=>{
		this.list = res.data;
	})
  },
  methods: {}
};
</script>

<style>
</style>
